{% extends "based/based.html" %}
{% block title %}{{_("图片展示编辑")}}-{% endblock %}
{% block content %}

<data id="cid" content="{{data.cid}}"></data>
<data id="id" content="{{data.id}}"></data>
<div class="row">
    <div class="col-md-12">
        <ul class="breadcrumb">
            <li><a href="/osr-admin/theme-setting/display/image?theme={{data.theme}}&cid={{data.cid}}&page={{data.fp}}">
                <i class="fa fa-image"></i> {{_("图文图库")}}</a></li>
            {% if data.id %}
            <li class="active">{{_("编辑")}}</li>
            {% else %}
            <li class="active">{{_("添加")}}</li>
            {% endif %}

        </ul>
    </div>
</div>


<div class="row osr-adm-edit-page">
    <div class="col-md-12 osr-col-xs-12">
        <section class="panel">
          <header class="panel-heading">
             <i class="fa fa-file-text"></i> {{_("图片文本")}}
          </header>
          <div class="panel-body">
              <div v-cloak id="app" >
                <figure class="text-center">
                    <p>
                        <img style="height:140px;width:auto;" :src="media.url" :alt="media.title">
                    </p>
                    <input id="upfile" class="sr-only form-control" type="file" name="upfile">
                    <label for="upfile"  class="btn btn-sm osr-btn btn-info">
                      <i class="fa fa-cloud-upload"></i>
                      {{_("选择图片")}}
                    </label>&nbsp;

                      <button v-on:click="upload_img()" type="button" class="btn btn-sm osr-btn btn-success">
                          {{_("上传更新")}}
                      </button>
                      <p id="file-list"></p>
                </figure>

                <div class="form-group">
                      <select id="status" name="status"  class="form-control osr-form-control input-sm" @change="switch_category($event.target.value)">
                       <option v-for="ct in media_categorys" v-if="ct._id==media.category_id"  :value="ct._id" selected>
                                {[ct.name]}
                        </option>

                        <option v-if="media.category_id !='default'" value="default" >{{_("默认")}}</option>
                        <option v-else  value="default___默认" selected>{{_("默认")}}</option>

                        <option v-for="ct in media_categorys" v-if="ct._id!=media.category_id"  :value="ct._id" >
                            {[ct.name]}
                        </option>
                    </select>
                </div>

                <div class="form-group">
                    <label>{{_("名称")}}</label>
                    <input name="name" type="text" class="form-control osr-input" v-model="media.name"
                           placeholder="{{_('名称')}}" data-bv-notempty-message="{{_('名称不能为空')}}" required/>
                </div>
                <div class="form-group">
                    <label>{{_("标题")}}</label>
                    <input type="text" class="form-control osr-input" v-model="media.title" placeholder="{{_('标题')}}" />
                </div>

                  <div class="form-group form-inline">
                  <label>{{_("展示开关")}}</label>
                    &nbsp;
                    <div class="checkbox checkbox-success">
                        <input id="switch" type="radio" class="form-check-input"  v-model="media.switch" value="1" />
                       <label for="switch" class="form-check-label"></label>
                       {{_("开启")}}
                    </div>
                    &nbsp;
                    <div class="checkbox checkbox-success">
                        <input id="current_switch" type="radio" class="form-check-input" v-model="media.switch" value="0" />
                       <label for="current_switch" class="form-check-label"></label>
                       {{_("关闭")}}
                    </div>
                </div>

                <div class="form-group">
                    <label>{{_("链接")}}</label>
                    <input type="text" class="form-control osr-input" v-model="media.link" placeholder="{{_('链接')}}" />
                </div>
                <div class="form-group form-inline">
                  <label>{{_("链接打开方式")}}</label>
                    &nbsp;
                    <div class="checkbox checkbox-success">
                        <input id="new_tab" type="radio" class="form-check-input"  v-model="media.link_open_new_tab" value="1" />
                       <label for="new_tab" class="form-check-label"></label>
                       {{_("新标签")}}
                    </div>
                    &nbsp;
                    <div class="checkbox checkbox-success">
                        <input id="current_tab" type="radio" class="form-check-input" v-model="media.link_open_new_tab" value="0" />
                       <label for="current_tab" class="form-check-label"></label>
                       {{_("当前标签")}}
                    </div>
                </div>

                  <hr>
                <div class="form-group form-inline">
                  <label>{{_("Code类型")}}</label>
                    &nbsp;
                    <div class="checkbox checkbox-success">
                        <input id="code_type_html" type="radio" class="form-check-input"  v-model="media.code_type" value="html" />
                       <label for="code_type_html" class="form-check-label"></label>
                       {{_("Html/Css/String")}}
                    </div>
                    &nbsp;
                    <div class="checkbox checkbox-success">
                        <input id="code_type_json" type="radio" class="form-check-input" v-model="media.code_type" value="json" />
                       <label for="code_type_json" class="form-check-label"></label>
                       {{_("Json/Array")}}
                    </div>
                </div>

                  <div class="form-group">
                     <label >{{_("Code")}}</label>
                      <textarea  class="form-control osr-input" v-model="media.code" placeholder="{{_('html/array/json')}}" >

                      </textarea>
                  </div>

              </div>
                <hr>
              <div class="form-group">
                 <label >{{_("文本内容")}}</label>
                 {% include 'module/editor/richtext.html' %}
              </div>

              <button class="btn osr-btn btn-info osr-submit-btn" onclick="save()">
                {{_("保存")}}
              </button>
          </div>
        </section>
    </div>
</div>
<script>
    var media_type = "image";
    $(function() {
        $('#upfile').on('change', function() {
          var fileNames = '';
          $.each(this.files, function() {
            fileNames += '<span class="badge">' + this.name + '</span> ';
          });
          $('#file-list').html(fileNames);
        });
    });

</script>
{% include 'theme-setting/display/_edit_script.html' %}
{% endblock %}